import BindFamilyMembers from '@/components/BindFamilyMembers';
import EvaluationRecord from '@/components/EvaluationRecord';
import FamilySickBeds from '@/components/FamilySickBeds';
import GuidanceRecord from '@/components/GuidanceRecord';
import HealthRecords from '@/components/HealthRecords';
import PhysiologicalMonitoring from '@/components/PhysiologicalMonitoring';
import TrainingRecord from '@/components/TrainingRecord';
import { get_patient_info } from '@/services/patient';
import age from '@/utils/age';
import { ProDescriptions } from '@ant-design/pro-components';
import { useModel } from '@umijs/max';
import { Divider, Modal, Spin, Tabs, Tooltip } from 'antd';
import React, { useEffect, useState } from 'react'

interface Iprops {
    isShowModal1: (show: boolean) => void;
    isModalOpen1: boolean;
    id_card: string | undefined;
    id: number | undefined;
}
type Info = {
    family_address: string;
    area_name: string;
    city_name: string;
    province_name: string;
    birth: string;
    id: number;
    phone: string;
    name: string;
    sex: number;
    id_card: string;
    bind_platform: string[];
    info: any;
};
const PatientDetails = (props: Iprops) => {
    const { isShowModal1, isModalOpen1, id } = props;
    // 存储下属机构患者信息
    const [patientinfo, setPatientInfo] = useState<Info | undefined>(undefined);
    // 存储患者身份证号
    const [id_card, setId_card] = useState();
      // 存储用户信息
  const { initialState, setInitialState } = useModel('@@initialState');
    useEffect(() => {
        //   页面初始化获取患者信息
        const getData = async () => {
            if (id) {
                let res: any = await get_patient_info({ id });
                console.log('患者详情', res);
                if (res.code === 200) {
                    setPatientInfo(res.data);
                    setId_card(res.data.id_card)
                }
            }
        };
        getData();
    }, []);

    // tabs列表
  const itemArr: any = [
    {
      key: '生理监测',
      label: '生理监测',
      children: <PhysiologicalMonitoring patientId={id}></PhysiologicalMonitoring>,
    },
    {
      key: '评估记录',
      label: '评估记录',
      children: (
        <EvaluationRecord type={true} patientId={id} id_card={id_card}></EvaluationRecord>
      ),
    },
    {
      key: '训练记录',
      label: '训练记录',
      children: <TrainingRecord patientId={id}></TrainingRecord>,
    },
    {
      key: '指导记录',
      label: '指导记录',
      children: <GuidanceRecord patientId={id}></GuidanceRecord>,
    },
    {
      key: '健康档案',
      label: '健康档案',
      children: <HealthRecords info={patientinfo?.info}></HealthRecords>,
    },
  ];
  // 有没有家庭病床权限
  if(initialState?.currentUser?.current_platform.model_permissions?.includes('familySickbeds')){
    itemArr.push(
      {
        key: '建床记录',
        label: '建床记录',
        children: <FamilySickBeds patientId={id}></FamilySickBeds>,
      } ,
    {
      key: '绑定家属',
      label: '绑定家属',
      children: <BindFamilyMembers patientId={id}></BindFamilyMembers>,
    })
  }
    return (
        <Modal
            title="下属机构患者详情"
            open={isModalOpen1}
            onCancel={() => isShowModal1(false)}
            width={1200}
            destroyOnClose={true}
            footer={null}
        >
            <Divider />
            {patientinfo === undefined ? (
                <div
                    style={{
                        margin: '20px 0',
                        marginBottom: '20px',
                        padding: '30px 50px',
                        textAlign: 'center',
                    }}
                >
                    <Spin size="large" />
                </div>
            ) : (
                <>
                    <ProDescriptions
                        dataSource={patientinfo}
                        columns={[
                            {
                                title: '手机号',
                                key: 'phone',
                                dataIndex: 'phone',
                            },
                            {
                                title: '姓名',
                                key: 'username',
                                dataIndex: 'username',
                            },
                            {
                                title: '性别',
                                key: 'sex',
                                dataIndex: 'sex',
                                valueType: 'select',
                                valueEnum: {
                                    0: {
                                        text: '未知',
                                    },
                                    1: {
                                        text: '男',
                                    },
                                    2: {
                                        text: '女',
                                    },
                                },
                            },
                            {
                                title: '身份证号',
                                key: 'id_card',
                                dataIndex: 'id_card',
                            },
                            {
                                title: '年龄',
                                key: 'birth',
                                dataIndex: 'birth',
                                render: (_, record) => age(record.birth),
                            },
                            {
                                title: '家庭地址',
                                key: 'address',
                                dataIndex: 'address',
                                render: (_, record) => {
                                    return (
                                        record.province_name +
                                        record.city_name +
                                        record.area_name +
                                        record.family_address
                                    );
                                },
                            },
                            {
                                title: "所属机构",
                                dataIndex: 'bind_platform',
                                key: 'bind_platform',
                                render: (_, record) => (
                                    <Tooltip title={record.bind_platform.map((item) => item).join()}>
                                        {record.bind_platform.map((item) => item).join().length > 10
                                            ? record.bind_platform
                                                .map((item) => item)
                                                .join()
                                                .substring(0, 10) + '...'
                                            : record.bind_platform.map((item) => item).join()}
                                    </Tooltip>
                                ),
                            }
                        ]}
                    ></ProDescriptions>
                    <Tabs
                        defaultActiveKey="生理监测"
                        style={{ minHeight: '600px' }}
                        items={itemArr}
                    />
                </>
            )}
        </Modal>
    )
}
export default PatientDetails